<template lang="html">
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="icon iconfont icon-jifen"></i> 编辑订单</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <el-form ref="form" :model="order" label-width="150px" @submit.native.prevent>
                <el-form-item label="订单编号">
                   <span>{{order.order_code}}</span>
                </el-form-item>
                <el-form-item label="产品名称">
                   <span>{{order.goods_list[0].name}}</span>
                </el-form-item>
                <el-form-item label="产品ID">
                   <span>{{order.goods_list[0].id}}</span>
                </el-form-item>
                <el-form-item label="下单人昵称">
                   <span>{{order.nick_name}}</span>
                </el-form-item>
                <el-form-item label="订单金额">
                   <span>{{order.total_money}}</span>
                </el-form-item>
                <el-form-item label="下单时间">
                   <span>{{order.create_time}}</span>
                </el-form-item>
                <el-form-item label="快递名称">
                   <span>{{order.express_name}}</span>
                </el-form-item>
                <el-form-item label="快递单号">
                   <span>{{order.express_code}}</span>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="goBack()">返回</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                order: {},
            }
        },
        watch: {},
        mounted() {
            this.getDeatils();
        },
        methods: {
            getDeatils() {
                if (this.$route.params.id && this.$route.params.id) {
                    this.$axios.get('/manage/order/detail', {
                        params: {
                            id: this.$route.params.id
                        }
                    })
                        .then(response => {
                            if (response.data.code == 200) {
                                //获取数据
                                console.log(response.data.data);
                                this.order = response.data.data;
                            } else {
                                this.$notify.error({
                                    title: '查询失败',
                                    duration: 2000,
                                    message: '失败原因：' + response.data.msg
                                });
                            }
                        })
                        .catch(function (response) {
                            console.log(response);
                        });
                } else {
                    this.$message.error('获取订单ID失败');
                }
            },
            goBack(){
                this.$router.push('/order')
            }
        }
    }
</script>

<style lang="stylus" scoped>
    .el-form-item .el-cascader {
        width: 400px;
    }

    .el-cascader-menus .el-cascader-menu {
        width: 240px
    }

    .sola-upload {

    .sola-left {
        width: 100%;
        height: auto;

    .sola-flex {
        float: left
        width: 360px;
        height: 180px;
        margin-bottom 20px;
        margin-right: 15px;
        position: relative;

    .delete {
        position: absolute;
        top: 2px;
        right: 13px;
        color: #f56c6c;
        display: inline-block;
        padding: 5px 5px;

    .el-alert__icon {
        font-size: 28px;
        cursor: pointer
    }

    }
    img {
        width: 100%;
        height: 100%;
    }

    }
    }
    .sola-file-box {
        position: relative;

    .btn-file {
        position: absolute;
        top: 0;
        left: 0;
        z-index 1;
        opacity: 0;
        width: 120px;
        height: 40px;
        outline: 0;
        background-color: none;
        cursor: pointer;
    }

    }

    }
</style>
